import React, {Component} from 'react';
import './Recommend.css';
import Swiper from "../../components/Recommend/Swiper/Swiper";
import MusicList from "../../components/Recommend/MusicList/MusicList";

class Recommend extends Component {
	constructor(props) {
		super(props);

		this.state = {
			banners: [],
			music:[],
		}
	}

	componentDidMount() {
		this.$axios([{
			url: '/banner'
		},{
			url:'/personalized'
		}]).then(res => {
			// console.log(res);

			if (res[0].code === 200) {
				this.setState(state => {
					return {
						banners: res[0].banners
					}
				})
			}

			if (res[1].code === 200) {
				this.setState(state => {
					return {
						music: res[1].result
					}
				})
			}
		})
	}

	render() {
		return (
			<div className='recommend'>
				<Swiper banners={this.state.banners}/>

				<div className="recommend-container">
					<div className="title">推荐歌单</div>
				</div>

				<MusicList music={this.state.music}/>

			</div>
		);
	}
}

export default Recommend;